﻿function fadeBackground(elementId, startColor, endColor, timeMs) {
    var startTime = new Date().getTime();
    stepFade(elementId, startColor, endColor, startTime, startTime + timeMs);
}

function stepFade(elementId, startColor, endColor, startTime, endTime) {
    var now = new Date().getTime();

    var step = new Array(3);

    var progress = (now - startTime) / (endTime - startTime);

    step[0] = Math.round(startColor[0] + ((endColor[0] - startColor[0]) * progress));
    step[1] = Math.round(startColor[1] + ((endColor[1] - startColor[1]) * progress));
    step[2] = Math.round(startColor[2] + ((endColor[2] - startColor[2]) * progress));

    document.getElementById(elementId).style.backgroundColor
		= "rgb(" + step[0] + "," + step[1] + "," + step[2] + ")";

    if (now <= endTime) {
        setTimeout(function() {
            stepFade(elementId, startColor, endColor, startTime, endTime);
        }, 20);
    }
    else {
        document.getElementById(elementId).style.backgroundColor
            = "rgb(" + endColor[0] + "," + endColor[1] + "," + endColor[2] + ")";
    }
}
/*var timer = null;
var timerWork = [];
var fadesRunning = 0;

var timerCallback = function() {
    var work = timerWork;
    timerWork = [];
    for (var i = work.length; i > 0; i--) {
        work[i - 1]();
    }
}

function toggleFadeExecuting(amt) {
    fadesRunning += amt;

    if (fadesRunning === 0) {
        clearInterval(timer);
        timer = null;
    }
    else {
        if (timer === null) {
            timer = setInterval(timerCallback, 100);
        }
    }
}

function fadeBackground(elementId, start, finished, time) {
    toggleFadeExecuting(1);
    var iterations = Math.round(time / 5);

    var step = new Array(3);

    step[0] = (finished[0] - start[0]) / iterations;
    step[1] = (finished[1] - start[1]) / iterations;
    step[2] = (finished[2] - start[2]) / iterations;

    stepFade(elementId, start, step, finished, iterations);
}

function stepFade(elementId, cur, step, finished, iterationsLeft) {
    iterationsLeft--;

    document.getElementById(elementId).style.backgroundColor 
        = "rgb(" + cur[0] + "," + cur[1] + "," + cur[2] + ")";

    cur[0] = Math.round(finished[0] - step[0] * iterationsLeft);
    cur[1] = Math.round(finished[1] - step[1] * iterationsLeft);
    cur[2] = Math.round(finished[2] - step[2] * iterationsLeft);

    if (iterationsLeft > 1) {
        timerWork.push(function() {
            stepFade(elementId, cur, step, finished, iterationsLeft);
        });
    }
    else {
        document.getElementById(elementId).style.backgroundColor 
            = "rgb(" + finished[0] + "," + finished[1] + "," + finished[2] + ")";
        toggleFadeExecuting(-1);
    }
}*/

/*function fadeBackground(elementId, start, end, time) {
    var iterations = Math.round(time / 5);

    var step = new Array(3);

    step[0] = (end[0] - start[0]) / iterations;
    step[1] = (end[1] - start[1]) / iterations;
    step[2] = (end[2] - start[2]) / iterations;

    stepFade(elementId, start, step, end, iterations);
}

function stepFade(elementId, cur, step, end, iterationsLeft) {
    iterationsLeft--;

    document.getElementById(elementId).style.backgroundColor
		= "rgb(" + cur[0] + "," + cur[1] + "," + cur[2] + ")";

    cur[0] = Math.round(end[0] - step[0] * iterationsLeft);
    cur[1] = Math.round(end[1] - step[1] * iterationsLeft);
    cur[2] = Math.round(end[2] - step[2] * iterationsLeft);

    if (iterationsLeft > 1) {
        setTimeout(function() {
            stepFade(elementId, cur, step, end, iterationsLeft);
        }, 5);
    }
    else {
        document.getElementById(elementId).style.backgroundColor 
            = "rgb(" + end[0] + "," + end[1] + "," + end[2] + ")";
    }
}*/